<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title></title>
		<script src="../jquery-1.11.3.min.js"></script>
		<script type="text/javascript">
			$(function(){
				//让father里所有的p标签变红
//				$('#father p').css({'color':'red'});
				
				//让father里第三个p标签变蓝
//				$('#father p').eq(2).css({'color':'blue'});

				//让father里第一个p标签变蓝
//				$('#father p').first().css({'color':'blue'});

				//让father里最后一个p标签变蓝
//				$('#father p').last().css({'color':'blue'});

				//判断是否存在类名为two的元素
//				if($('#father p').hasClass('two')){
//					alert(true);
//				}else{
//					alert(false);
//				}

				//筛选出类名为two的元素 并上色
//				$('#father p').filter('.two').css({'color':'blue'});

				//判断#father里是否有son的div 并且上色
//				if($('#father div').is('.son')){
//					$('#father .son').css({'color':'orange'});
//				}

				//如果#father里存在span标签 那么就让father全变色。父子级比较
//				$('#father').has('span').css({'color':'blue'});
//				$('#father div').has('.sonP').css({'color':'green'});

				//#father中的div不是.son的变色
//				$('#father div').not('.son').css({'color':'green'});
	
//				截取下标为2至下标为4的p标签变色
//				$('#father p').slice(2,4).css({'color':'red'});
				
			})
		</script>
	</head>
	<body>
		<div id="father">
			<p>我们都是p标签</p>
			<p class="two">我们都是p标签</p>
			<span class="three">我们都是p标签</span>
			<p>我们都是p标签</p>
			<p>我们都是p标签</p>
			<p>我们都是p标签</p>
			<div class="son">
				<p class="sonP">我们也是p标签</p>
				<p>我们也是p标签</p>
				<p>我们也是p标签</p>
			</div>
			<div class="small">
				<p>我们也是p标签</p>
				<p>我们也是p标签</p>
				<p>我们也是p标签</p>
			</div>
		</div>
	</body>
</html>
